/* css reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,img { margin:0; padding:0; border:0; }
body { background:#fff; color:#000; font-size:16px; font-family: "微软雅黑"; }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal;}
a { color:#555; text-decoration:none; }
a:hover { text-decoration:none;color: #0085ff; }
ol,ul,li { list-style:none; }
input, textarea, select, button { font:16px Verdana,Helvetica,Arial,sans-serif;border: none }
input:focus{
    outline: none;
}

/*注册*/
.register_box{
    width: 400px;
    height: 600px;
    box-shadow: 0 0 10px 1px rgba(0,0,0,0.2);
    margin: 50px auto;

}
.header {
    width: 100%;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    letter-spacing: 10px;
}

.register_info{
    width: 90%;
    margin: 20px auto;
}
.register_info li{
    width: 100%;
    margin-bottom: 20px;
    position: relative;

}
.register_info li span{
    display: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: absolute;
    width: auto;
    font-size: 12px;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    background-color: rgba(0,0,0,0.5);
    z-index: 9;
    left:0;
    top:105%
}
.register_info li span:before{
    content: '';
    display: block;
    position: absolute;
    border:8px solid transparent;
    border-bottom-color: rgba(0,0,0,0.5);
    top:-16px;
    left: 10%;
    /*transform:rotate(45deg);*/
}

.register_info li input{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 5px;
    border-radius: 5px;
    border: 1px solid #dfdfdf;
}

.register_info li input.correct{
    border: 1px solid #ace;
}
.register_info li input.mistake{
    border: 1px solid #f96;
}
.register_info li input:focus+span{
    display: block;
}

.register_btn{
    display: block;
    width: 90%;
    height: 40px;
    line-height: 40px;
    border-radius: 20px;
    color: #fff;
    text-align: center;
    letter-spacing: 10px;
    margin: 50px auto;
}


.gradient_bg{
    background-color: #999;
    background: -moz-linear-gradient(left, #ace, #f96);
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#ace), to(#f96));/*Safari4-5,chrome1-9 */
    background: -webkit-linear-gradient(left, #ace, #f96);
    background: -o-linear-gradient(left, #ace, #f96);
    background: -ms-linear-gradient(left, #ace, #f96);
    background: linear-gradient(left, #ace, #f96);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#999', endColorstr='#000',GradientType=1 );/*兼容IE5~IE9   */
}
:root .gradient_bg{filter:none;}


.pupTips{
    display: none;
    position: absolute;
    top:50%;
    left:50%;
    text-align: center;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    color: #fff;
    padding: 10px 20px;
    background: rgba(0,0,0,0.5);
    border-radius: 5px;
    z-index: 99;
}